
import 'package:example/widgets/nine_patch_image.dart';
import 'package:example/widgets/nine_patch_image_custom.dart';
import 'package:flutter/material.dart';
import 'package:flutter_base_app/base/base_page.dart';
import 'package:flutter_base_app/base/base_page_view_model.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:ninepatch_image/ninepatch_image.dart' as ninelib;

class PageNinePatchCustom extends StatefulWidget {
  const PageNinePatchCustom({super.key});

  @override
  State<PageNinePatchCustom> createState() => _PageOneState();
}

class _PageOneState extends BasePageState<BasePageViewModel, PageNinePatchCustom> {

  ValueNotifier<String> text = ValueNotifier("aaa");

  double imageWidth = 375.w;
  double imageHeight = 546.w;

  @override
  Widget buildContent(BuildContext context) {
    return Container(
      width: double.infinity,
      height: double.infinity,
      color: Colors.green,
      child: Stack(
        children: [
          Container(
            margin: EdgeInsets.only(left: 0, top: 50),
            width: 347.w,
            height: 544.w,
            color: Colors.white,
            child: Image(
              image: AssetImage('assets/images/test_1_1.9.png'),
              fit: BoxFit.fill,
            ),
          ),


          Positioned(
            left: 50.w,
            top: 50,
            child: Opacity(
              opacity: 0.3,
              child: Container(
                width: 347.w,
                height: 644.w,
                color: Colors.white,
                child: NinePatchImageCustom(
                  imageProvider: AssetImage('assets/images/test_1_1.9.png'),
                  hideLines: false,
                  scale: 1.0,
                  localPixelScale: 1.w,
                ),
              ),
            ),
          ),


          // Positioned(
          //     left: 50.w,
          //     top: 50,
          //     child: Opacity(
          //       opacity: 0.3,
          //       child: Container(
          //         width: 347.w,
          //         height: 544.w,
          //         color: Colors.red,
          //         child: ninelib.NinePatchImage(
          //           imageProvider: const AssetImage('assets/images/test_1_1.9.png'),
          //           hideLines: false,
          //           child: Container(),
          //         ),
          //       ),
          //     )),

          // Positioned(
          //     left: 50.w,
          //     top: 50,
          //     child: Opacity(
          //       opacity: 0.3,
          //       child: Container(
          //         width: 347.w,
          //         height: 544.w,
          //         color: Colors.amber,
          //         child: NinePatchImage(
          //           imageProvider: const AssetImage('assets/images/test_1_1.9.png'),
          //           hideLines: false,
          //           scale: 1.0,
          //           child: Container(),
          //         ),
          //       ),
          //     )),

          GestureDetector(
            onTap: (){
              setState(() {
                imageHeight = imageHeight + 10.w;
              });
            },
            child: Container(
              width: 100,
              height: 100,
              color: Colors.yellow,
              child: Text("click"),
            ),
          )
        ],
      ),
    );
  }

  @override
  BasePageViewModel createViewModel() {
    return BasePageViewModel();
  }
}
